<template>
    <div>
        <my-nav-bar
            fixed
            title="步骤条，兄弟"
            left-text="返回"
            right-text="按钮"
            @click-left="onClickLeft"
            @click-right="onClickRight"
        ></my-nav-bar>
        <h2 class="title" style="margin-top: 46px;">步骤条</h2>

        <my-step current="2" >
            <step-item>
                <span slot="bottom">步骤一</span>
            </step-item>
            <step-item>
                <span slot="bottom">步骤二</span>
            </step-item>
            <step-item>
                <span slot="bottom">步骤三</span>
            </step-item>
            <step-item>
                <span slot="bottom">步骤四</span>
            </step-item>
        </my-step>



        <my-step theme="2" current="3" >
            <step-item>
                <span slot="top">已发货</span>
                <span slot="bottom">广州市</span>
            </step-item>
            <step-item>
                <span slot="top">运输中</span>
                <span slot="bottom">佛山市</span>
            </step-item>
            <step-item>
                <span slot="top">派件中</span>
                <span slot="bottom">北滘镇</span>
            </step-item>
            <step-item>
                <span slot="top">已签收</span>
                <span slot="bottom">李如青</span>
            </step-item>
        </my-step>
    </div>
</template>
<script>
export default {
  data() {
    return {

    };
  },
  methods: {
    onClickLeft() {
      this.$router.$go(-1);
    },

    onClickRight() {
      console.log("right");
    }
  }
};
</script>
<style lang="less" scoped>

</style>
